LOGICIELS
ActionScript > Boutons commandant lecture vidéo
par : gwenola
Boutons commandant une vidéo
1. Dans un nouveau document Flash, créez un Movie Clip (Ctrl/Pomme+F8). Nommez-le Vidéo.
2. Choisissez menu Fichier - File > Importer > sur la scène - to Stage > sélectionnez le fichier .mov prévu pour cette leçon.
3. Dans le panneau d’importation qui apparaît, validez les 2 premières fenêtres en cliquant sur Suivant - Next puis, dans la 3eme fenêtre, choisissez Finir - Finish pour achever l’importation.
4. Une nouvelle fenêtre apparaît, vous signalant le nombre d’images requis pour la lecture totale de la vidéo, validez en cochant Oui - Yes. Puis, dans l’Inspecteur des propriétés, placez la vidéo aux coordonnées X et Y 0.0 px.
5. Créez un nouveau calque, nommez-le Boutons. Créez 3 boutons à l’aide des outils de conception graphique de la barre d’outil :
a. Bouton Play
Allez
dans le menu Affichage - View > Règles - Rulers. Puis créez un carré
avec l’outil Rectangle, de 40.0 px de côté. Attribuez-lui une couleur
de fond, pas de contour.
Activez
l’outil Plume et approchez-le d’un coin droit du carré. Lorsque la
Plume affiche un signe Moins ( - ), cliquez. Des petits carrés
apparaissent alors aux coins du carré. Cliquez dans un carré du côté
droit pour supprimer un coin.
Activez
la Flèche Blanche et sélectionnez le petit carré restant du côté droit.
Remontez-le sur l’axe des Y, à mi-hauteur entre les deux coins de
gauche.
Dans
l’Inspecteur des propriétés, vérifiez que le triangle mesure tjs 40 px
en X et en Y, et positionnez-le à X - 100.0 et Y 135.0 px.
Depuis
la règle Verticale, tirez 3 repères et placez-les aux bords gauche,
droit et au milieu de la vidéo. Puis, depuis la règle Horizontale,
placez un repère au sommet supérieur de la forme Play.
b. Bouton Stop
Créez
un carré sans contour de 40.0 px de côté. Placez son coin supérieur
droit à l’intersection des repères de droite.
c. Bouton Pause
Créez
un rectangle sans contour de H 40.0 px x L 20.0 px. Positionnez son
coin supérieur droit contre les repères centraux, puis soustrayez, via
l’Inspecteur des propriétés, - 12 px en X.
Dupliquez
ce rectangle : sélectionnez-le avec la Flèche Noire, puis
maintenez Alt enfoncé et faites glisser le bouton de la souris.
Positionnez le coin supérieur gauche de la copie contre les repères
centraux, puis ajoutez 12 px en X via l’Inspecteur des propriétés.
Supprimez les repères : menu Affichage - View > Repères - Guides > Supprimer - Clear Guides.
6. Convertissez les 3 formes en Boutons (F8), nommés respectivement Bt_Play, Bt_Stop et Bt_Pause.
7. Allez sur la scène principale en cliquant sur la flèche tout en haut à gauche, au-dessus de la liste des calques.
Ouvrez la Bibliothèque du document : menu Fenêtre - Window > Bibliothèque - Library. Faites glisser une instance du Movie Clip Vidéo de la bibliothèque sur la scène. Prévisualisez l’animation à ce stade : Ctrl/Pomme+Enter.
8. Reste à placer une action temporelle pour bloquer la vidéo à son point de départ, et une action pour chaque bouton, pour commander la lecture de la vidéo :
a. Action temporelle :
- Sur la scène principale, double-cliquez sur le Clip pour entrer en imbrication. Dans le scénario du Clip, créez un nouveau calque nommé Actions en haut de la pile de calques.
- Dans l’Inspecteur des propriétés, cliquez sur le bouton fléché pour accéder au panneau des Actions.
- Dans la ligne du temps, sélectionnez l’image 1 du calque Actions, puis, dans le panneau Actions, entrez :
b. Actions boutons :
- Sélectionnez le bouton Play sur la scène. Dans le panneau Actions, entrez :
- Sélectionnez le bouton Pause sur la scène. Dans le panneau Actions :
- Sélectionnez le bouton Stop sur la scène. Dans le panneau Actions :

